<template>
  <div ref="energyConsumption1" style="width: 100%; height: 380px"></div>
</template>

<script>
import * as echarts from "echarts";
import { sanShow5 } from "@/api/charts";
export default {
  mounted() {
    this.drawsolid();
  },
  methods: {
    drawsolid() {
      sanShow5()
        .then(({data}) => {
          var chartDom = this.$refs.energyConsumption1;
          var myChart = echarts.init(chartDom);
          var option;

          option = {
            title: {
              text: "消费规模",
            },
            tooltip: {
              trigger: "item",
              formatter: "{a} <br/>{b} : {c}%",
            },
            series: [
              {
                name: "Funnel",
                type: "funnel",
                left: "10%",
                top: 60,
                bottom: 60,
                width: "80%",
                min: 0,
                max: 10000,
                minSize: "0%",
                maxSize: "100%",
                sort: "descending",
                gap: 2,
                label: {
                  show: true,
                  position: "inside",
                },
                labelLine: {
                  length: 10,
                  lineStyle: {
                    width: 1,
                    type: "solid",
                  },
                },
                itemStyle: {
                  borderColor: "#fff",
                  borderWidth: 1,
                },
                emphasis: {
                  label: {
                    fontSize: 20,
                  },
                },
                data //**************** */
              },
            ],
          };

          option && myChart.setOption(option);
        })
        .catch((err) => {});
    },
  },
};
</script>

<style>
</style>